.page {
  background-color: #fff;
  width: 100%;
  border-top: 1px solid rgb(240, 240, 240);
  padding: 10px;
  display: flex;
  justify-content: space-between;
}
.imgBox {
  width: 60px;

  height: 60px;
}
.imgBox img {
  border-radius: 10px;
  height: 100%;
  width: 100%;
}
.page_left {
  display: flex;
}
.imgRight {
  margin-left: 10px;
  display: flex;

  flex-direction: column;
  height: 100%;
  justify-content: space-around;
}
.page_mid {
  display: flex;
  justify-content: space-around;
  flex-direction: column;
  justify-content: space-around;
}
.page_mid_top {
  display: flex;
}
.process {
  background-color: #bfbfbf;
  height: 3px;
  width: 450px;
  border-radius: 50px;
  overflow: hidden;
}
.process:hover {
  transform: scaleX(1.1);
}
.process:active {
  background-color: #fff;
}
progress::-webkit-progress-bar {
  background-color: #d7d7d7;
}

progress::-webkit-progress-value {
  background-color: rgb(77, 195, 118);
}
.audioBox {
  display: flex;
  align-items: center;
  margin-left: 150px;
}
